<!DOCTYPE html>
<html lang="en"> 
<head>
<title>智企相-首页</title>
<link href="static/images/favicon.ico" rel="icon" />
<!-- for-mobile-apps -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <script>
        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
		}

		var flag;
    </script>
	
	<!-- animation css files -->
	<link rel="stylesheet" href="static/css/animation-aos.css">
	<link href='static/css/aos.css' rel='stylesheet prefetch' type="text/css" media="all" />
	<!-- //animation css files -->

	<!-- css files -->
    <link href="static/css/bootstrapindex.css" rel='stylesheet' type='text/css' /><!-- bootstrap css -->
    <link href="static/css/style.css" rel='stylesheet' type='text/css' /><!-- custom css -->
    <link href="static/css/fontawesome-all.css" rel="stylesheet"><!-- fontawesome css -->
	<!-- //css files -->
	
	<!-- google fonts -->
	<link href="//fonts.googleapis.com/css?family=Source+Sans+Pro:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet">
	<!-- //google fonts -->
	
</head>
<body>

<!-- header -->
<header class="index-banner">
	
    <!-- nav -->
    <nav class="main-header" style="float: left;">
	<div>
		<img src="static/images/main-logo_v1.png" style="transform: scale(0.95);" >
	</div>
	<div>

	</div>
    <div id="menu">
        <!-- <div id="menu-toggle">
          <div id="menu-icon">
            <div class="bar"></div>
            <div class="bar"></div>
            <div class="bar"></div>
          </div>
        </div> -->
        <ul style="text-align: center;" class="text-center text-capitalize nav-agile" data-aos="zoom-in-up">
		  <li>
            <a href="#choose" class="scroll">为什么选择我们？</a>
		  </li>
          <li>
            <a href="#faq" class="scroll">问题与解答</a>
          </li>
		  <li>
            <a href="#aboutus" class="scroll">开发者介绍</a>
		  </li>

          <li>
            <button type="button" class="btn w3ls-btn" data-toggle="modal" aria-pressed="false" data-target="#exampleModalCenter2">
              登录
            </button>
          </li>
        </ul>
    </div>
    </nav>
    <!-- //nav -->
	<!-- banner -->
	<div class="banner layer" id="home">
		<div class="container">
			<div class="row banner-text">
				<div class="slider-info col-lg-8">
					<h3 class="txt-w3_agile" data-aos="fade-down">智能化企业画像构建系统</h3>
					<a class="btn mt-4 mr-2 text-capitalize" data-aos="fade-up" onclick="query()" role="button">查询企业标签</a>
					<a class="btn mt-4 mr-2 text-capitalize" data-aos="fade-up" onclick="filter()"  role="button">筛选企业标签</a>
					<a class="btn mt-4 mr-2 text-capitalize" data-aos="fade-up" onclick="prediction()"  role="button">预测企业标签</a>
					<a class="btn mt-4 mr-2 text-capitalize" data-aos="fade-up" onclick="admin()"  role="button">管理员模式</a>
					<script>
						function query(){
							if(flag==1)
							window.location = "Query.html"; 
							else
							$("#exampleModalCenter2").modal('show');
						}
						function filter(){
							if(flag==1)
							window.location = "filter.html"; 
							else
							$("#exampleModalCenter2").modal('show');
						}
						function prediction(){
							if(flag==1)
							window.location = "prediction.html"; 
							else
							$("#exampleModalCenter2").modal('show');
						}
						function admin(){
							if(flag==1)
							window.location = "admin.html"; 
							else
							$("#exampleModalCenter2").modal('show');
						}	
					</script>
					<a class="btn mt-4 mr-2 text-capitalize col-lg-first" data-aos="fade-up" href="#" data-toggle="modal" data-target="#exampleModalCenter1" role="button">功能使用介绍</a>
				</div>
				<div class="col-lg-4 col-md-8 mt-lg-0 mt-5 banner-form" data-aos="fade-left">
					<h5><i class="fas mr-2 fa-laptop"></i>新用户注册</h5>
					<form action="#" class="mt-4" method="post">
						<input class="form-control" type="text" name="Name" placeholder="用户名" required="" />
						<input class="form-control" type="email" name="Email" placeholder="邮箱" required="" />
						<input class="form-control" type="text" name="Number" placeholder="电话" required="" />
						<input class="form-control" type="password" name="Number" placeholder="设置密码" required="" />
						<input class="signup form-control" type="reset" value="注册账号"
						 data-aos="fade-up" data-toggle="modal" data-target="#exampleModalCenter4" onclick="signup()">
						<!-- <input class="form-control" type="submit" value="注册账号"
						 data-aos="fade-up" data-toggle="modal" data-target="#exampleModalCenter4" onclick="signup()"> -->
					</form>
				</div>
			</div>
		</div>
	</div>
	<!-- //banner -->
</header>
<!-- //header -->

<!-- why choose us -->
<section class="choose py-5" id="choose">
	<div class="container py-md-3">
		<h3 class="heading mb-5 text-center" data-aos="zoom-in">为什么选择我们？</h3>
		<div class="feature-grids row">
			<div class="col-lg-4 col-md-6" data-aos="fade-right">
				<div class="f1 icon1 p-4">
					<h3 class="my-3">企业数据处理</h3>
					<h5 class="my-3">多种数据处理技术规整大量企业数据</h5>
					<p style="text-indent:2em;">
本系统在数据噪声清洗、数据特征抽取、数据合并、数据计算、数据分组、数据标准化等基础的数据处理技术基础上，
创新性地采取“连续数据分割”技术，对于内聚程度不高的连续数据，通过一次无监督聚类将其“离散化”，
在尽可能保留数据原有意义的情况下增强数据的内聚性，且减小数据的冗余度，提高系统处理速度和效率。</p>
					<h5 class="my-3">引入数据表征差异建立独特的数据库架构</h5>
					<p style="text-indent:2em;">
本系统的数据库建立依靠“高度保留数据本身的实际意义”、“切实区分各字段对标签表征的能力差异”、
“尽量规避数据量和数据格式带来的数据噪声”等原则，我们设计了连续表、权重表、影响表、标准表、合并表等五种表，
这五种表之间互相配合，互相交互，组成了我们的聚类数据库。影响表和标准表分别定义了连续表和权重表的标签表征能力。
					</p>
				</div>
			</div>
			<div class="col-lg-4 col-md-6" data-aos="fade-up">
				<div class="f1 icon2 p-4">
					<h3 class="my-3">无监督分类算法</h3>
					<h5 class="my-3">将分散数据进行对数函数映射使其均匀集中</h5>
					<p style="text-indent:2em;">
本系统的企业数据在很多情况下呈分散不均匀的情况，取值偏低的数据点很密集，
取值高的数据点则很少，取值越高分布越稀疏。这会使得聚类结果“畸形化”，少部分极端数据带来了较大的影响。
我们采用了“对数函数映射”的方法，将分散数据均匀化，极端数据集中化。
</p>
					<h5 class="my-3">对多维数据进行合理降维从而优化聚类效果</h5>
					<p style="text-indent:2em;">
本系统的企业数据具有“单主键多字段”的特点，每个企业背后的相关字段数目多少不一，
如果一起进行聚类的话会造成冲突影响。往往涉及企业较少的字段对企业聚类的影响反而较大，
并且字段间的无效关联也会造成较大的负面影响。我们将原始数据中的两个特征以二范数（取平方和后再开根号）的方式合并成一个特征，
让聚类算法对这一个特征进行分类打标签，并且补充了加权平均值的功能，高效地做到降维操作，优化聚类结果。
					</p>
				</div>
			</div>
			<div class="col-lg-4 col-md-6 mt-lg-0 mt-4" data-aos="fade-left">
				<div class="f1 icon3 p-4">
					
					<h3 class="my-3">后台程序运行</h3>
					<h5 class="my-3">将程序操作封装成命令便于复杂方法训练</h5>
					<p style="text-indent:2em;">
本项目的数据集经过预处理后复杂度直线上升，单个数据表往往要进行多次操作，
数据要进行多次转换处理，整体训练逻辑呈不规则的树状结构。
因此，不能将训练逻辑固定到程序逻辑里，而应该将程序设计为开放式，
外加一个训练方案文件以指令序列的形式来描述训练过程。我们通过组合使用指令序列，
可以让程序实现各种复杂的训练，不止是树状训练逻辑，就算是网状训练逻辑也可以轻松而准确地完成。
</p>
					<h5 class="my-3">模型训练结果以及前端标签展示可视化</h5>
					<p style="text-indent:2em;">
本项目的模型训练结果主要为企业的各方面标签，但是和直接以文字显示的普通方式不同，
我们加入了大量的数据可视化操作，将标签以图表的形式生动形象地呈现在用户面前。
在桌面应用系统端，我们加入了“雷达图”的表现形式，让用户一目了然就能对企业有一个清晰的认识，
同时也能了然企业的优劣势。在网页Web端，我们采用美观简洁的表格形式呈现，让用户可以精准的找到
自己关心的标签信息。
					</p>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- //why choose us -->

<!-- quote -->
<section class="quote bg-light py-5">
	<div class="container py-md-3" data-aos="fade-up">
		<h4>本系统是浪潮云计算产品，欢迎您去浪潮官网体验更多的优质服务，使用更全的数据功能！</h4>
		<div class="start text-right mt-4" data-aos="flip-left">
			<a href="https://www.inspur.com/" class="btn" target="_blank">去访问</a>
		</div>
		<div class="clearfix"></div>
	</div>
</section>
<!-- //quote -->



<!-- 问题与回答 -->
<section class="faq-w3l py-5" id="faq">
	<div class="container py-lg-3">
	<h3 class="heading mb-5 text-center" data-aos="zoom-in">大家比较关心的问题</h3>
		<div class="row faq-info">
			<div class=" col-md-6 faq-w3agile">
				<ul class="faq pl-sm-4 pl-3">
					<li class="item1 item mt-sm-4 mt-3 pt-3 pl-2" data-aos="flip-left">
						<h4>系统的企业数据来源自哪里？</h4>
						<ul>
							<li class="subitem1 mt-3">
								<p> 本系统的数据全部来源于“浪潮”公司，最终解释权归“浪潮”公司所有。</p>
							</li>
						</ul>
					</li>
					<li class="item2 item mt-sm-4 mt-3 pt-3 pl-2" data-aos="flip-left">
						<h4>查询的企业范围多大？</h4>
						<ul>
							<li class="subitem1 mt-3">
								<p> 目前本系统仅能查询到济南市的部分中小微企业，期待后续企业数据库的补充！</p>
							</li>
						</ul>
					</li>
					
				</ul>
			</div>
			<div class=" col-md-6 faq-w3agile">
				<ul class="faq pl-sm-4 pl-3">
					<li class="item5 item mt-sm-4 mt-3 pt-3 pl-2" data-aos="flip-right">
						<h4>这个系统收费吗？</h4>
						<ul>
							<li class="subitem1 mt-3">
								<p>目前系统功能有限，暂不收费，所有功能均为免费使用，整个系统均未设置广告，请放心使用。</p>
							</li>
						</ul>
					</li>
					<li class="item3 item mt-sm-4 mt-3 pt-3 pl-2" data-aos="flip-left">
						<h4>为什么用不了管理员模式？</h4>
						<ul>
							<li class="subitem1 mt-3">
								<p> 管理员模式是本系统开发维护人员用来训练维护模型的，需要管理员账号登录才能使用。</p>
							</li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
	</div>
</section>
<!-- //faqs -->

<!-- 开发成员 -->
<section class="testimonials bg-light py-5" id="aboutus">
	<div class="container py-lg-3">
		<h3 class="heading mb-5 text-center" data-aos="zoom-in">开发者介绍</h3>
		<div class="row test-grids">
			<div class="col-md-4 col-sm-7 col-9" data-aos="zoom-in">
				<img src="static/images/b3.png" alt="" class="img-fluid" />
			</div>
			<div class="col-md-8">
				<div class="callbacks_container">
					<ul class="rslides" id="slider3">
						<li data-aos="fade-down">
							<div class="testi-pos">
								<h4>谢彪</h4>
								<span class="">Team Leader</span>
								<ul class="d-flex mt-2">
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas fa-star"></i></li>
								</ul>
							</div>
							<div class="testi-agile">
								<p>
									<i class="fas fa-quote-left pr-3"></i>
									我是一名在校大学生，担任本系统开发组组长。
									希望这个系统能带给你帮助。
									<i class="fas fa-quote-right pr-3"></i>
								</p>
							</div>
						</li>
						<li data-aos="fade-down">
							<div class="testi-pos">
								<h4>付凌峰</h4>
							   <span class="">Programming Manager</span>
								<ul class="d-flex mt-2">
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas fa-star"></i></li>
								</ul>
							</div>
							<div class="testi-agile">
								<p>
									<i class="fas fa-quote-left pr-3"></i>
									我是一名在校大学生，担任本系统开发组技术主管。
									在模型算法上我们尽力使其更加完善，更好地勾勒企业画像，未来我们仍会努力。
									<i class="fas fa-quote-right pr-3"></i>
								</p>
							</div>
						</li>
						<li data-aos="fade-down">
							<div class="testi-pos">
								<h4>曹洋</h4>
								<span class="">Product Manager</span>
								<ul class="d-flex mt-2">
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas fa-star"></i></li>
								</ul>
							</div>
							<div class="testi-agile">
								<p>
									<i class="fas fa-quote-left pr-3"></i>
									我是一名在校大学生，担任本系统开发组产品主管。
									系统整个开发过程中我们都在尽力收集用户需求，设计产品，如果你有新的需求，可以联系我们。
									<i class="fas fa-quote-right pr-3"></i>
								</p>
							</div>
						</li>
						<li data-aos="fade-down">
							<div class="testi-pos">
								<h4>肖震宇</h4>
								<span class="">Test Manager</span>
								<ul class="d-flex mt-2">
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas fa-star"></i></li>
								</ul>
							</div>
							<div class="testi-agile">
								<p>
									<i class="fas fa-quote-left pr-3"></i>
									我是一名在校大学生，担任本系统开发组测试主管。
									我负责系统开发整个过程的测试工作，找到错误故障并且定位，如果你在使用过程中发现问题，可以联系我们解决。
									<i class="fas fa-quote-right pr-3"></i>
								</p>
							</div>
						</li>
						<li data-aos="fade-down">
							<div class="testi-pos">
								<h4>吴志伟</h4>
								<span class="">Design Manager</span>
								<ul class="d-flex mt-2">
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas mr-1 fa-star"></i></li>
									<li><i class="fas fa-star"></i></li>
								</ul>
							</div>
							<div class="testi-agile">
								<p>
									<i class="fas fa-quote-left pr-3"></i>
									我是一名在校大学生，担任本系统开发组设计主管。
									系统的外在界面直接和使用系统的你接触，而使界面美观，功能合理则是我的目标。
									<i class="fas fa-quote-right pr-3"></i>
								</p>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- //testimonials -->







<!-- 阅读更多 -->
<div class="modal fade" id="exampleModalCenter1" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenter1" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title text-capitalize text-center" id="exampleModalLongTitle"> <i class="fab fa-blackberry"></i>功能使用介绍</h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				<strong>本系统主要有四个功能模块：</strong>查询企业标签、筛选企业标签、预测企业标签、管理员模式。其中前三个功能是普通注册用户可用，“管理员模式”仅支持管理员用户使用。
				<br><strong>查询企业标签：</strong>通过单个或批量输入企业名称，查询企业对应标签及其具体信息，构建企业画像。
				<br><strong>筛选企业标签：</strong>通过在所有标签上进行筛选，保留需要的标签，可以查看所有符合保留标签的企业，并且也可以单独查看这些企业的具体标签信息。
				<br><strong>预测企业标签：</strong>通过输入或选择一个新企业的基本信息，可以得到在本系统环境下，该企业的标签及其具体信息。
				<br><strong>管理员模式：</strong>可以训练本系统的机器学习模型，得到详细的评估参数。
				<br><strong>祝您使用愉快！</strong>
			</div>
			<div class="modal-footer">
				<!-- <button type="button" class="btn btn-primary">Save Changes</button> -->
				<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<!-- //Vertically centered Modal -->

<!--/登录-->
<div class="modal fade" id="exampleModalCenter2" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header text-center">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				<div class="login px-4 mx-auto mw-100">
					<h5 class="text-center mb-4">立即登录</h5>
					<form action="#" method="post">
						<div class="form-group">
							<label class="mb-2">邮箱</label>
							<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="" required="">
							<small id="emailHelp" class="form-text text-muted"></small>
						</div>
						<div class="form-group">
							<label class="mb-2">密码</label>
							<input type="password" class="form-control" id="exampleInputPassword1" placeholder="" required="">
						</div>
						<div class="form-check mb-2">
							<input type="checkbox" class="form-check-input" id="exampleCheck1">
							<label class="form-check-label" for="exampleCheck1">记住密码</label>
						</div>
						<div class="form-check mb-2">				
							<input type="checkbox" class="form-check-input" id="exampleCheck2">	
							<label class="form-check-labe2" for="exampleCheck2">自动登录</label>
						</div>
						<div class="form-check mb-2">				
							<input type="checkbox" class="form-check-input" id="exampleCheck2">	
							<label class="form-check-labe3" for="exampleCheck3">是管理员</label>
						</div>
						<a class="btn btn-primary submit mt-2" data-aos="fade-up" href="#" data-toggle="modal" data-target="#exampleModalCenter3" onclick="user_del()" role="button">登录</a>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>
<!--//Login-->

<script>
	function user_del(){
		$("#exampleModalCenter2").modal('hide');
		flag = 1;
	}
</script>

<!-- 登录确认框 -->
<div class="modal fade" id="exampleModalCenter3" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenter3" aria-hidden="true" >
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title text-capitalize text-center" id="exampleModalLongTitle"> <i class="fab fa-blackberry"></i> 登录成功！</h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				智企相欢迎您！
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-primary submit mt-2" data-dismiss="modal">确认</button>
			</div>
		</div>
	</div>
</div>

<!-- 注册确认框 -->
<div class="modal fade" id="exampleModalCenter4" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenter4" aria-hidden="true" >
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title text-capitalize text-center" id="exampleModalLongTitle"> <i class="fab fa-blackberry"></i> 注册成功！</h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				智企相欢迎您的加入！有问题随时联系我们！
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-primary submit mt-2" data-dismiss="modal">确认</button>
			</div>
		</div>
	</div>
</div>
<!-- //Vertically centered Modal -->

    <!-- js -->
    <script src="static/js/jquery-2.2.3.min.js"></script>
    <script src="static/js/bootstrapindex.js"></script>
    <!-- //js -->
	
	<!-- animation js -->
	<script src='static/js/aos.js'></script>
	<script>
		AOS.init({
            easing: 'ease-out-back',
            duration: 1000
        });

    </script>
	<!-- //animation js -->

	<!-- testimonials  Responsiveslides -->
    <script src="static/js/responsiveslides.min.js"></script>
    <script>
        // You can also use"$(window).load(function() {"
        $(function () {
            // Slideshow 4
            $("#slider3").responsiveSlides({
                auto: true,
                pager: true,
                nav: false,
                speed: 500,
                namespace: "callbacks",
                before: function () {
                    $('.events').append("<li>before event fired.</li>");
                },
                after: function () {
                    $('.events').append("<li>after event fired.</li>");
                }
            });

        });
    </script>
    <!-- //testimonials  Responsiveslides -->

	<!-- sticky nav bar-->
	<script>
		$(() => {

		  //On Scroll Functionality
		  $(window).scroll(() => {
			var windowTop = $(window).scrollTop();
			windowTop > 100 ? $('nav').addClass('navShadow') : $('nav').removeClass('navShadow');
			windowTop > 100 ? $('ul.nav-agile').css('top', '50px') : $('ul.nav-agile').css('top', '160px');
		  });

		  //Click Logo To Scroll To Top
		  $('#logo').on('click', () => {
			$('html,body').animate({
			  scrollTop: 0
			}, 500);
		  });


		  //Toggle Menu
		  $('#menu-toggle').on('click', () => {
			$('#menu-toggle').toggleClass('closeMenu');
			$('ul').toggleClass('showMenu');

			$('li').on('click', () => {
			  $('ul').removeClass('showMenu');
			  $('#menu-toggle').removeClass('closeMenu');
			});
		  });

		});
	</script>
	<!-- //sticky nav bar -->

	<script src="static/js/smoothscroll.js"></script><!-- Smooth scrolling -->

    <!-- start-smoth-scrolling -->
    <script src="static/js/move-top.js"></script>
    <script src="static/js/easing.js"></script>
    <script>
        jQuery(document).ready(function ($) {
            $(".scroll").click(function (event) {
                event.preventDefault();
                $('html,body').animate({
                    scrollTop: $(this.hash).offset().top
                }, 900);
            });
        });
    </script>
    <script>
        $(document).ready(function () {
            $().UItoTop({
                easingType: 'easeOutQuart'
            });

        });
    </script>
    <!-- //end-smoth-scrolling -->

</body>
</html>